<template>
  <div>
    <div v-for="(i,index) in datalist" :key='index'>
    <div v-for="(j,ind) in i" :key="ind"> {{j.name}} <el-input  placeholder="请输入内容" style="width:200px;" v-model="namevalues[j.key+index]"></el-input></div>
   
  
    </div>
    <el-button @click="add">+</el-button>

    <el-button @click="submit">提交</el-button>



    <ul>
  <li v-for='(t,int) in vlist' :key="int">
  
  {{t.name}}
            <el-input v-model="title[t.name]" />
  
  </li>
  </ul>

  <button @click='submit2'>添加2</button>

  </div>
</template>

<script>
export default {
    data(){
        return{
             vlist:[{ "name": "姓名" },{ "name": "请假类型" }],
             namevalues:[],
             sum:1,
             title:[],
             datalist:[[{"name":"名称","key":'name'},{"name":"类型",'key':'type'},{"name":"值",'key':'value'}]]
        }
       
    },
    methods: {
        add(){
            this.sum++;
            this.datalist.push([{"name":"名称","key":'name'},{"name":"类型",'key':'type'},{"name":"值",'key':'value'}])
            
        },
        submit(){
           
            for(var i=0;i<this.sum;i++){
                var name = "name"+i
                var type = "type"+i
                var value = "value"+i
                // this.vlist.push([{"name":this.namevalues[name],"type":this.namevalues[type],"value":this.namevalues[value]}])
            }
            
        },
        submit2(){
            console.log(this.title)
        }
    },
}
</script>

<style>

</style>